<template>
  <div class="novel-list">
    <h2>小说列表</h2>
    <ul>
      <li v-for="novel in novels" :key="novel.id">
        <router-link :to="{ name: 'NovelDetail', params: { id: novel.id } }">{{ novel.title }}</router-link>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      novels: [
        { id: 1, title: '小说1' },
        { id: 2, title: '小说2' },
        { id: 3, title: '小说3' }
      ]
    };
  }
};
</script>

<style scoped>
.novel-list {
  padding: 20px;
}

ul {
  list-style-type: none;
  padding: 0;
}

li {
  margin-bottom: 10px;
}
</style>
